<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>教育资源-教师资源</title>
	<link rel="stylesheet" href="css/common.css">
	<link rel="stylesheet" href="css/AlbumAdd.css">	
</head>
<body>
<div id ="header" ></div>
<div class="albumMainBg">
	<div class="albumMid mainList">
		<ul class="navBar clearfix">
			<li><a href="">工作空间</a></li>
			<li><span class="breakUp">></span></li>
			<li><a href="">相册</a></li>
			<li><span class="breakUp">></span></li>
			<li><a href="">上传照片</a></li>
		</ul>
		<h2 class="space_tit">上传照片</h2>
		<div class="mainDiv">
			<div class="lineHeight">
				<label for="selectTwo" class="tit">
					选择相册:
				</label>
				<select name="selectTwo" id="selectOne">
					<option value="相册11111">相册11111</option>
					<option value="相册22222">相册22222</option>
					<option value="相册333333">相册333333</option>
				</select>
				<button class="AlbumMake" id="makeAlbumBtn">创建相册</button>
			</div>
			<div class="lineHeight">
				<label for="selectTwo" class="tit">
					选择照片:
				</label>
				<div class="textArea">
					<div id="uploader-demo">
				        <!--用来存放item-->
				        <div id="fileList" class="uploader-list"></div>
				        <div id="filePicker">选择图片</div>
					</div>
				</div>
			</div>
			<div class="lineHeight">
				<label for="textArea22">
					照片描述：
				</label>
				<textarea name="" id="textAreaTwo" class="textAreaTwo" maxlength="200"></textarea>
			</div>
			<button type="button"  class="btnUpload">开始上传</button>
		</div>
	</div>
</div>
<div class="footerBot"></div>
<script src="./js/jquery.js"></script>
<script src="./js/fxtpl.plus.js"></script>
<link rel="stylesheet" href="./webupload/webuploader-albumAdd.css">
<script src="./webupload/webuploaderAum.js"></script>
<script src="./webupload/uploadAlbum.js"></script>
<script src="./layui/layui.all.js"></script>
<link rel="stylesheet" href="./layui/css/layui.css">
<script>
 var numSpace = {numSpace:5};
 var header = Fxtpl.render('./weight/headerAllInputChange.html',numSpace);
 $('#header').html(header);

$(".content a").on("click",function(){
	var numIndex = $(".content a").index($(this));
	$(".content a").each(function(){
		$(this).removeClass("on");
	});
	$(this).addClass("on");
	$(".albumMid .content11").each(function(){
		$(this).removeClass("onCont");
	});
	$(".albumMid .content11").eq(numIndex).addClass("onCont");
});

var str= '<div class="lineHeight2 clearfix">';
	str += '<label for="name">相册名称</label>';
	str += '<input type="text" maxlength="10" name="name" id="name" class="inputForm">';
	str	+='<label>';
	str +='<strong>3</strong>';
	// 这里面有个计数的功能；
	str +='/30';
	str +='</label>';
	str += '</div>';
	str += '<div class="lineHeight2 clearfix">';
		str += '<label for="describe">相册描述:</label>';
		str += '<textarea type="textarea" name="describe" placeholder="说说这个相册的故事...(非必填)"  class="textareaIn"></textarea>';
		str	+='<label>';
		str +='<strong>3</strong>';
		// 这里面有个计数的功能；
		str +='/30';
		str +='</label>';
	str += '</div>';
	str += '<div class="lineHeight2 clearfix">';
	str +="<label for='power' >相册权限</label>";
	str += '<select name="power" >';
	str +='<option value="">所有人可见</option>';
	str +='<option value="">好友可见</option>';
	str +=	'<option value="">仅主人可见</option>';
	str +=	'</select>';
	str +='<div class="btnLine">';
		str +="<button class='sure'>确定</button>";
		str +="<button class='cancal'>取消</button>";
	str +='</div>';
	str +=	'</div>';
// 点击出现弹出框的内容
$("#makeAlbumBtn").on("click",function(){
	layer.open({
      type: 1,
      title:"创建相册",
      area: ['437px', '320px'],
      shadeClose: true, //点击遮罩关闭
      content:str,
    });
});

// 关闭按钮
$(document).on('click','.btnLine .cancal',function(){
	layer.close(layer.index)
});
</script>
</body>	
</html>